<template>
  <el-drawer
    v-model="show_submit_list_box"
    direction="rtl"
    size="80%"
    destroy-on-close
    :close-on-click-modal="false"
    @open="open"
    @close="$emit('close')"
  >
    <div class="c_666">
      错误率公式：本次提交时
      <span class="c_333 fw">新增总件数</span> / 首次资料提交时<span class="c_333 fw">
        新增总件数</span
      >
      * 1000‰ (保留两位小数) + 往次错误率总和
    </div>
    <div class="m_10_0">提交记录</div>
    <el-table :data="submit_list" border max-height="800" row-key="id">
      <el-table-column type="expand">
        <template #default="prop">
          <div class="fw">提交物料信息</div>
          <el-table :data="prop.row.taskOrderDetailDTOList" border class="m_top10">
            <el-table-column label="材料类别">
              <template #default="scope">
                <div v-for="item in table_type_list" :key="item.value">
                  <span v-if="scope.row.materialType == item.value">{{
                    item.label
                  }}</span>
                </div>
              </template>
            </el-table-column>
            <el-table-column
              label="新增补料标准件件数(件)"
              prop="newStandardNum"
            ></el-table-column>
            <el-table-column
              label="新增补料标准件面积/长度(m²/m)"
              prop="newStandardAreaLength"
            ></el-table-column>
            <el-table-column
              label="新增补料非标件件数(件)"
              prop="newNoStandardNum"
            ></el-table-column>
            <el-table-column
              label="新增补料非标件面积/长度(m²/m)"
              prop="newNoStandardAreaLength"
            ></el-table-column>
            <el-table-column
              label="取消标准件件数(件)"
              prop="cancelStandardNum"
            ></el-table-column>
            <el-table-column
              label="取消标准件面积/长度(m²/m)"
              prop="cancelStandardAreaLength"
            ></el-table-column>
            <el-table-column
              label="取消非标件件数(件)"
              prop="cancelNoStandardNum"
            ></el-table-column>
            <el-table-column
              label="取消非标件面积/长度(m²/m)"
              prop="cancelNoStandardAreaLength"
            ></el-table-column>
            <el-table-column
              label="原件改制件数(件)"
              prop="originalChangeNum"
            ></el-table-column>
            <el-table-column
              label="原件改制面积/长度(m²/m)"
              prop="originalChangeAreaLength"
            ></el-table-column>
          </el-table>

          <div v-if="prop.row.type == 4">
            <div class="fw m_top10">返工物料信息</div>
            <el-table :data="prop.row.sceneReworkDTOList" border class="m_top10">
              <el-table-column label="设计人员" prop="newStandardNum"
                ><template #default="scope">
                  <div v-for="item in member_list" :key="item.memberId">
                    <span v-if="scope.row.memberId == item.memberId">{{
                      item.name
                    }}</span>
                  </div>
                </template></el-table-column
              >
              <el-table-column label="材料类别">
                <template #default="scope">
                  <div v-for="item in table_type_list" :key="item.value">
                    <span v-if="scope.row.materialType == item.value">{{
                      item.label
                    }}</span>
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="返工件数(件)" prop="reworkNum"></el-table-column>
              <el-table-column
                label="返工面积/长度(m²/m)"
                prop="reworkAreaLength"
              ></el-table-column>
            </el-table>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="序号" type="index" width="80"></el-table-column>
      <el-table-column label="提交人">
        <template #default="scope">
          <div v-for="item in member_list" :key="item.memberId">
            <span v-if="scope.row.orderMemberId == item.memberId">{{ item.name }}</span>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="提及时间">
        <template #default="scope">
          {{ formatDate(Number(scope.row.updateTime), "yyyy-mm-dd hh:mm:ss") }}
        </template>
      </el-table-column>
      <el-table-column label="提交类型">
        <template #default="scope">
          <div v-for="item in type_list" :key="item.value">
            <span v-if="scope.row.type == item.value">{{ item.label }}</span>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="新增总件数" prop="addNum"></el-table-column>
      <el-table-column label="总错误率(‰)" prop="wrongRate"></el-table-column>
      <el-table-column label="备注" prop="remark" show-overflow-tooltip></el-table-column>
    </el-table>
  </el-drawer>
</template>

<script lang="ts" setup>
import { ref, toRefs } from "vue";
import axios from "@/service/HttpRequest";
import serviceApi from "@/service/api";
import { formatDate } from "@/utils/check_role"; // 权限校验
import { ElMessage } from "element-plus";
const props = defineProps({
  show_submit_list_box: Boolean,
  item_form_data: Object,
  member_list: Array,
});
const { member_list, item_form_data, show_submit_list_box } = toRefs<any>(props);
console.log(item_form_data.value);
// 1铝件 2铁件 3背楞 4辅料 5铁配件
const table_type_list = ref([
  { value: 1, label: "铝件" },
  { value: 2, label: "铁件" },
  { value: 3, label: "背楞" },
  { value: 4, label: "辅料" },
  { value: 5, label: "铁配件" },
]);
const type_list = ref([
  { value: 1, label: "首次下单" },
  { value: 2, label: "设计变更" },
  { value: 3, label: "需求变更" },
  { value: 4, label: "现场返工" },
]);
// 以往提交过的记录
const submit_list = ref([]);
const open = () => {
  get_submit_list();
};
const get_submit_list = () => {
  axios
    .request({
      url: serviceApi.taskOrder + "/list",
      method: "post",
      data: { taskId: item_form_data.value.id },
    })
    .then((res) => {
      console.log(res.data);
      submit_list.value = res.data;
    })
    .catch((err) => {
      ElMessage.error(err);
    });
};
</script>

<style lang="scss" scoped></style>
